﻿<!doctype html>
<html lang="en">
	<head>
		<meta charset="UTF-8">
		<title>人脸比对</title>
		<link rel="stylesheet" type="text/css" href="../css/pop.css">
		<link rel="stylesheet" type="text/css" href="../css/normal.css">
		<link rel="stylesheet" type="text/css" href="../css/loading.css">
		<script type="text/javascript" src="../js/jquery.js"></script>	
		<script type="text/javascript" src="../js/detect.js"></script>
		<script type="text/javascript" src="../js/common.js"></script>
		<script type="text/javascript" src="../js/pop.js"></script>
		<script type="text/javascript" src="../js/compare.js"></script>
		<script type="text/javascript" src="../js/json2.js"></script>	

		<script type="text/javascript">
		function Init()
		{
			document.getElementById("fileText").value = "";
			document.getElementById("fileText2").value = "";
			var el = document.getElementById("cloudwalkwebobj");
			createPlugin(el);
		}
</script>     
	</head>
	<body  onload="Init()"  style="background:rgba(0,0,0,0.15);filter: progid:DXImageTransform.Microsoft.gradient(startcolorstr=#26000000,endcolorstr=#26000000);">
	<input type="file" id="fileUpload" onchange="previewImage(this)"  style="display:none;"/>  
	<input type="file" id="fileUpload2" onchange="previewImage2(this)"  style="display:none;"/>  
		<div class="content" style="width:100%;height:100%;">
			<div class="top2" >
				<div class="top2-left" style="width:310px;">
					<div id="preview" style="width:310px;height:365px;text-align:center;vertical-align:middle;display:inline-block;line-height:365px;">
						<img id="imgA" alt="" src="../images/tianjiazhaopian.png"  style="max-height:365px;max-width:300px;vertical-align:middle;">
					</div>
                    <span class="icon" style="vertical-align:middle;width:310px;">
                    	<input id="fileText" type="text" readonly style="vertical-align:middle;">
						<img id = "shangchuan1" alt="" src="../images/shangchuan.png" id="imghead" onclick="click_GetBase64ByLocalFileA();"style="vertical-align:middle;cursor:pointer;"/>
						<img id = "xiangi1" alt="" src="../images/xiangji.png" onclick="showBg('imgA');" style="vertical-align:middle;cursor:pointer;"/>
                    </span>
				</div>
				<div class="top2-right" style="width:310px;" >
					<div id="preview2"  style="width:310px;height:365px;text-align:center;vertical-align:middle;display:inline-block;line-height:365px;">
						<img id="imgB" alt="" src="../images/tianjiazhaopian.png" style = "max-height:365px;max-width:300px;vertical-align:middle;" >
					</div>
                    <span class="icon" style="vertical-align:middle;width:310px;">
                    	<input id="fileText2" type="text" readonly style="vertical-align:middle;">
						<img id = "shangchuan2" alt="" src="../images/shangchuan.png" id="imghead2" onclick="click_GetBase64ByLocalFileB();"style="vertical-align:middle;cursor:pointer;"/>
						<img id = "xiangi2" alt="" src="../images/xiangji.png" onclick="showBg('imgB');" style="vertical-align:middle;cursor:pointer;"/>
                    </span>
				</div>
			</div>
		<!--	<div class="top3" style="margin-top:20px;">
				<div class="top3-left" style="float:left;width:50%;text-align:right;">
					<span style="margin-right:20px;">
						<input id="fileText" type="text" readonly style="border:red solid 1px;line-height:47px;height:26px;width:182px">
						<img alt="" src="../images/shangchuan.png" id="imghead" onclick="click_GetBase64ByLocalFileA();">
						<img id = "xiangi1" alt="" src="../images/xiangji.png" onclick="showBg('imgA');"/>
					</span>
				</div>
				<div class="top3-right" style="text-align:left;">
					<span style="margin-left:20px;">
						<input id="fileText2" type="text" readonly style="border:red solid 1px;line-height:47px;height:26px;width:182px;margin-left:40px;">
						<img alt="" src="../images/shangchuan.png" id="imghead2" onclick="click_GetBase64ByLocalFileB();">
						<img id = "xiangi2" alt="" src="../images/xiangji.png" onclick="showBg('imgB');">
					</span>
				</div>
			</div>-->
			<div class="top4" style="width:100%;text-align:center;" > 
						<div class="top4-center" style="margin-left:auto;margin-right:auto;height:auto;width:640px; "  >
							<div  style="margin-top:24.5px;text-align:center;width:640px;height:auto;">
								<span id="faceCompareBtn" style="display:block;color:white;background:#CE4242;width:640px;font:normal 30px 微软雅黑;padding:11px 0px;" ><span  style="cursor:pointer;margin:11px 0;" onclick = "click_CompareByBase64();">点击人脸比对</span></span>
								<div style="background:rgba(245,235,233,0.75);filter: progid:DXImageTransform.Microsoft.gradient(startcolorstr=#bff5ebe9,endcolorstr=#bff5ebe9);height:236px;position:relative">
									<div  style="position:absolute;top:60px;left:50%;margin-left:-36px"><img id="question" src="../images/question.png"/></div>	
									<span id="score" style="color:#CE4242;display:block;width:640px;height:88px;font:normal 36px 微软雅黑;padding-top:30px;text-align:center"></span>
									<span id="info"  style="color:#CE4242;display:block;width:640px;height:118px;font:normal 24px 微软雅黑;"></span>
								</div>
								
								
							</div>
						</div>
				
			</div>
		</div>


		<div id="cloudwalkwebobj" style=" margin: 0 auto;" align="center"></div>
		<!--弹出层开始-->
		<div id="main">
			<div id="fullbg"></div> 
				<div id="dialog"> 
				<p class="close"><a href="#" onclick="closeBg();"></a></p> 
				<div id="cloudwalkwebobjadd" style=" margin: 0 auto;" align="center"></div>
				<div id="closeBtn" class="close_button"> <img src="../images/xiangjipaizhao.png" onclick="takePicture();"/> </div> 
				</div> 
		</div> 
		<!--弹出层结束--> 
		<div id="over" class="over"></div>
		<div id="layout" class="layout"><img src="../images/loading.gif" /><p style="margin-left:2px;">人脸比对中...</p></div>
	</body>
</html>